<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Join | CACode Excel</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="/static/vendor/bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome CSS-->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css"
          integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
    <!-- Google fonts - Popppins for copy-->
    <link rel="stylesheet" href="/static/css/googleapis.css">
    <!-- orion icons-->
    <link rel="stylesheet" href="/static/css/orionicons.css">
    <!-- theme stylesheet-->
    <link rel="stylesheet" href="/static/css/style.default.css" id="theme-stylesheet">
    <!-- Custom stylesheet - for your changes-->
    <link rel="stylesheet" href="/static/css/custom.css">
    <!-- Favicon-->
    <link rel="shortcut icon" href="/static/img/favicon.png?3">
    <!-- Tweaks for older IEs-->
    <!--[if lt IE 9]>
    <script src="/static/js/html5shiv.min.js"></script>
    <script src="/static/js/respond.min.js"></script><![endif]-->
</head>

<body style="overflow: hidden">
<div class="row">
    <div class="card col-lg-4 col-md-6 col-sm-12" style="margin: 10% auto">
        <div class="card-header">
            <h3 class="h6 text-uppercase mb-0">Join CACode Excel</h3>
        </div>
        <div class="card-body">
            <p>The minimum password length is 6 digits</p>
            <form action="/join" method="post">
                <div class="form-group">
                    <label class="form-control-label text-uppercase">Email</label>
                    <input type="email" placeholder="Email Address" id="email" name="email" class="form-control">
                </div>
                <div class="form-group">
                    <label class="form-control-label text-uppercase">Password</label>
                    <input type="password" placeholder="Password" id="password" name="password" class="form-control">
                </div>
                <div class="form-group">
                    <div>
                        {% if error_text %}
                            <p style="color: red">ERROR:&nbsp;&nbsp;{{ error_text }}!!!!!!</p>
                        {% endif %}
                        {% if login %}
                            <a href="/login" class="text-primary">Login --></a>
                        {% endif %}
                    </div>
                    <button type="submit" class="btn btn-primary">Sign in</button>
                </div>
            </form>
        </div>
    </div>
</div>
<!-- JavaScript files-->
<script src="/static/vendor/jquery/jquery.min.js"></script>
<script src="/static/vendor/popper.js/umd/popper.min.js"></script>
<script src="/static/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="/static/vendor/jquery.cookie/jquery.cookie.js"></script>
<script src="/static/vendor/chart.js/Chart.min.js"></script>
<script src="/static/js/js.cookie.min.js"></script>
<script src="/static/js/front.js"></script>
</body>

</html>